<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" %>
<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1 , user-scalable=no">
    <title>微电影</title>
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/static/base/images/logo.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/bootstrap-movie.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/animate.css">
    <style>
        .navbar-brand > img {
            display: inline;
        }

        .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
            padding-right: 3px;
            padding-left: 3px;
        }

        .media {
            padding: 3px;
            border: 1px solid #ccc
        }
    </style>
</head>

<body>
<!--导航-->
<%@include file="includetop.jsp"%>
<%--<nav class="navbar navbar-default navbar-fixed-top">--%>
<%--    <div class="container">--%>
<%--        <!--小屏幕导航按钮和logo-->--%>
<%--        <div class="navbar-header">--%>
<%--            <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">--%>
<%--                <span class="icon-bar"></span>--%>
<%--                <span class="icon-bar"></span>--%>
<%--                <span class="icon-bar"></span>--%>
<%--            </button>--%>
<%--            <a href="index.jsp" class="navbar-brand" style="width:250px;">--%>
<%--                <img src="${pageContext.request.contextPath}/resource/static/base/images/logo.png" style="height:30px;">&nbsp;微电影--%>
<%--            </a>--%>
<%--        </div>--%>
<%--        <!--小屏幕导航按钮和logo-->--%>
<%--        <!--导航-->--%>
<%--        <div class="navbar-collapse collapse">--%>
<%--            <form class="navbar-form navbar-left" role="search" style="margin-top:18px;">--%>
<%--                <div class="form-group input-group">--%>
<%--                    <input type="text" class="form-control" placeholder="请输入电影名！">--%>
<%--                    <span class="input-group-btn">--%>
<%--                        <a class="btn btn-default" href="search.jsp"><span class="glyphicon glyphicon-search"></span>&nbsp;搜索</a>--%>
<%--                    </span>--%>
<%--                </div>--%>
<%--            </form>--%>
<%--            <ul class="nav navbar-nav navbar-right">--%>
<%--                <li>--%>
<%--                    <a class="curlink" href="index.jsp"><span class="glyphicon glyphicon-film"></span>&nbsp;电影</a>--%>
<%--                </li>--%>
<%--                <c:choose>--%>
<%--                    <c:when test="${sessionScope.userName!=null}">--%>
<%--                        <li>--%>
<%--                            <a class="curlink" href="/person/toUserInformation"><span class="glyphicon glyphicon-user"></span>&nbsp;${sessionScope.userName}</a>--%>
<%--                        </li>--%>
<%--                        <li>--%>
<%--                            <a class="curlink" href="/person/layout"><span class="glyphicon glyphicon-log-out"></span>&nbsp;退出</a>--%>
<%--                        </li>--%>
<%--                    </c:when>--%>
<%--                    <c:otherwise>--%>
<%--                        <li>--%>
<%--                            <a class="curlink" href="/person/tologin"><span class="glyphicon glyphicon-log-in"></span>&nbsp;登录</a>--%>
<%--                        </li>--%>
<%--                        <li>--%>
<%--                            <a class="curlink" href="/person/toRegister"><span class="glyphicon glyphicon-plus"></span>&nbsp;注册</a>--%>
<%--                        </li>--%>
<%--                    </c:otherwise>--%>
<%--                </c:choose>--%>
<%--            </ul>--%>
<%--        </div>--%>
<%--        <!--导航-->--%>

<%--    </div>--%>
<%--</nav>--%>
<!--导航-->
<!--内容-->
<div class="container" style="margin-top:76px">
    <div class="col-md-3">
        <div class="list-group">
            <a href="/person/toUserInformation" class="list-group-item">
                <span class="glyphicon glyphicon-user"></span>&nbsp;会员中心
            </a>
            <a href="/person/toUserInformation" class="list-group-item">
                <span class="glyphicon glyphicon-lock"></span>&nbsp;修改密码
            </a>
            <a href="/comment/adminComment/${sessionScope.userName}" class="list-group-item">
                <span class="glyphicon glyphicon-comment"></span>&nbsp;评论记录
            </a>
            <a href="#" class="list-group-item active">
                <span class="glyphicon glyphicon-calendar"></span>&nbsp;登录日志
            </a>
            <a href="/admin/adminFavoriteVideosId/${sessionScope.userId}" class="list-group-item">
                <span class="glyphicon glyphicon-heart"></span>&nbsp;收藏电影
            </a>
        </div>
    </div>
    <div class="col-md-9">
        <div class="panel panel-warning">
            <div class="panel-heading">
                <h3 class="panel-title"><span class="glyphicon glyphicon-map-marker"></span>&nbsp;登录日志</h3>
            </div>
            <div class="panel-body">
                <div>
                    <table class="table table-bordered">
                        <thead>
                        <tr>
                            <td style="width:10%">用户编号</td>
                            <td style="width:30%">登录时间</td>
                            <td style="width:30%">登录IP</td>
                            <td style="width:30%">登录地址</td>
                        </tr>
                        </thead>
                        <tbody id="page-tbody">
                        <c:forEach var="log" items="${logList.list}">
                            <tr>
                                <td style="width:10%">${log.personId}</td>
                                <td style="width:30%">${log.loginTime}</td>
                                <td style="width:30%">${log.ip}</td>
                                <c:choose>
                                    <c:when test="${log.loginAddress!=null}"><td style="width:30%">${log.loginAddress}</td></c:when>
                                    <c:otherwise><td style="width:30%">暂无数据</td></c:otherwise>
                                </c:choose>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                </div>
                <div id="log-page" class="box-footer clearfix">
                    <ul class="pagination pagination-sm no-margin pull-right">
                        <li><a href="#" onclick="getlogs(1)">首页</a></li>
                        <c:choose>
                            <c:when test="${logList.isFirstPage}">
                                <li><a href="#" onclick="getlogs(1)">上一页</a></li>
                            </c:when>
                            <c:otherwise>
                                <li><a href="#" onclick="getlogs(${logList.pageNum-1})">上一页</a></li>
                            </c:otherwise>
                        </c:choose>
                        <li><a href="#">${logList.pageNum}</a></li>
                        <c:choose>
                            <c:when test="${logList.pageNum>=logList.pages}">
                                <li><a href="#" onclick="getlogs(${logList.pages})">下一页</a></li>
                            </c:when>
                            <c:otherwise>
                                <li><a href="#" onclick="getlogs(${logList.pageNum + 1})">下一页</a></li>
                            </c:otherwise>
                        </c:choose>
                        <li><a href="#" onclick="getlogs(${logList.pages})">尾页</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<!--内容-->
<!--底部-->
<footer>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <p>
                    ©&nbsp;2017&nbsp;flaskmovie.imooc.com&nbsp;京ICP备 13046642号-2
                </p>
            </div>
        </div>
    </div>
</footer>
<!--底部-->
<script src="${pageContext.request.contextPath}/resource/static/base/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/base/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/base/js/jquery.singlePageNav.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/base/js/wow.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/static/lazyload/jquery.lazyload.min.js"></script>
<script src="//cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>
<script>
    function getlogs(index) {
        var data = {
            "pageNum": index,
            "pageSize": 10,
        }
        $.ajax({
            url: "/person/pagelog",
            data: data,
            type: "get",
            dataType: "json",
            success: function (res) {
                var body = $("#page-tbody");
                body.empty();
                for (let i = 0; i < res.data.list.length; i++) {
                    var date=new Date(res.data.list[i].loginTime).toLocaleDateString();
                    var time=new Date(res.data.list[i].loginTime).toLocaleTimeString();
                    var tr = '<tr>' +
                        '<td style="width:10%">' + res.data.list[i].personId + '</td>' +
                        '<td style="width:30%">' +date+' '+time + '</td>' +
                        '<td style="width:30%">' + res.data.list[i].ip + '</td>' ;
                    if (res.data.list[i].loginAddress!=null){
                        tr=tr+ '<td style="width:30%">' + res.data.list[i].loginAddress + '</td>' ;
                    }else {
                        tr=tr+ '<td style="width:30%">暂无数据</td>' ;
                    }
                    tr=tr+'</tr>';
                    body.append(tr);
                }
                var page = $("#log-page");
                page.empty();
                var li = '<ul class="pagination pagination-sm no-margin pull-right">' +
                    '<li><a href="#" onclick="getlogs(1)">首页</a></li>';
                if (res.data.pageNum > 1) {
                    li = li + '<li><a href="#" onclick="getlogs(' + (res.data.pageNum - 1) + ')">上一页</a></li>';
                } else {
                    li = li + '<li><a href="#" onclick="getlogs(' + res.data.pageNum + ')">上一页</a></li>';
                }
                li = li + '<li><a href="#">' + res.data.pageNum + '</a></li>'
                if (res.data.pageNum >= res.data.pages) {
                    li = li + '<li><a href="#" onclick="getlogs(' + (res.data.pages) + ')">下一页</a></li>'
                } else {
                    li = li + '<li><a href="#" onclick="getlogs(' + (res.data.pageNum + 1) + ')">下一页</a></li>'
                }

                li = li + '<li><a href="#" onclick="getlogs(' + res.data.pages + ')">尾页</a></li>' + '</ul>';
                page.append(li);
            },
            error: function () {
                alert("小二正忙，一会再试");
            }
        })
    }
</script>
</body>
</html>
